<!-- 在该界面需要获取 u_id class_id--> 
<template>
  <view class="page">
    <van-uploader style="margin: 10rpx; height: 100px; width: 20px; background-color: white"
                  :file-list="fileList"
                  preview-size="80px"
                  upload-icon="plus"
                  @delete="deleteClick"
                  @after-read="afterRead" />
    <van-field :value="context"
               border="false"
               size="large"
               type="textarea"
               placeholder="期待你的分享……"
               autosize
               custom-style="height: 400rpx; margin-top: 5%; border-radius: 30rpx"
               @input="change">
    </van-field>

    <van-dropdown-menu>
      <van-dropdown-item title="发表社区"
                         :value="value"
                         :options="option"
                         @change="changeClassId" />
    </van-dropdown-menu>

    <van-row class="footer">
      <van-col span="8"
               offset="1">
        <van-button icon="star-o"
                    color="#FFCCCC"
                    custom-style="border-radius:20rpx"
                    type="primary"
                    @click="tempSave">存草稿</van-button>
      </van-col>
      <van-col span="15">
        <van-button custom-style="width:95%;border-radius:20rpx"
                    color="#CCCCFF"
                    type="primary"
                    @click="creatContext">发表说说</van-button>
      </van-col>
    </van-row>
    <van-toast id="van-toast" />
  </view>
</template>

<script>
import toast from '../../../wxcomponents/vant/toast/toast'
export default {
  onLoad: function (option) {
    console.log(option._id)
    this.user.u_id = option._id
  },
  mounted: function () {
    this.getMessage()
  },
  data() {
    return {
      user: {
        u_id: '',
      },
      userInfor: '',
      option: [
        { text: '食堂', value: 1 },
        { text: '课程', value: 2 },
        { text: '穿搭', value: 3 },
      ],
      value: 0,
      context: '',
      class_id: '',
      fileList: [],
    }
  },
  methods: {
    deleteClick(e) {
      console.log(e.detail.index)
      this.fileList.splice(e.detail.index)
    },
    async getMessage() {
      try {
        const value = uni.getStorageSync('storage')
        if (value) {
          console.log(value)
          this.context = value.context
          this.fileList = value.fileList
        }
      } catch (e) {}
    },
    change(e) {
      this.context = e.detail
    },
    changeClassId(e) {
      this.class_id = e.detail
    },
    creat() {
      if (this.class_id == '') {
        toast.fail('请选择社区')
      } else if (this.context == '' && this.fileList.length == 0) {
        toast.fail('请输入内容或图片')
      } else {
        this.wyhhyjrequest
          .run('create', {
            u_id: this.user.u_id,
            class_id: this.class_id,
            content: this.context,
            like: 0,
            image_address: this.fileList,
          })
          .then((res) => {
            if (res == true) {
              toast.success('发表成功')
              try {
                uni.removeStorageSync('storage')
              } catch (e) {
                toast.error('清除缓存失败')
              }
              setTimeout(() => {
                this.jumpBcak()
              }, 1500)
            } else toast.fail('发表失败')
          })
      }
    },
    creatContext() {
      const hasInfor = uni.getStorageSync('hasInfor')
      if (hasInfor != 1) {
        wx.getUserProfile({
          desc: '请求获取您的头像和昵称', // 声明获取用户个人信息后的用途，后续会展示在弹窗中，请谨慎填写
          success: (res) => {
            this.userInfor = res.userInfo
            uni.setStorage({
              key: 'userInfor',
              data: res.userInfo,
            })
            uni.setStorage({
              key: 'hasInfor',
              data: 1,
            })
            console.log(this.userInfor.avatarUrl)
            this.wyhhyjrequest
              .run('setNickname', {
                _id: this.user.u_id,
                nickName: this.userInfor.nickName,
                avatar: this.userInfor.avatarUrl,
              })
              .then((res) => {this.creat()})
          },
        })
      }else{
          this.creat()
      }
    },
    afterRead(e) {
      const path = e.detail.file.path
      const fileUploadToken = 'cf8991ff-f1e4-43fb-899c-9d59ba521f77' // 替换成你的客户端上传 token，可在后台「设置」页面获取
      const file = { path: path }
      this.wyhhyjrequest.file
        .upload('text_path_node.txt', file, { token: fileUploadToken })
        .then((data) => {
          // 上传成功
          let tempImage = { url: data.url, isImage: true }
          this.fileList.push(tempImage)
          //返回上一层
        })
        .catch((error) => {
          // 调用失败，进行错误处理
          toast.error('发表失败')
        })
    },
    //跳转到其他界面
    jumpBcak() {
      // wx.navigateBack();
      uni.navigateTo({
        url: '../mainPage/mainPage',
      })
    },
    // login() {
    //   const hasInfor = uni.getStorageSync('hasInfor')
    //   if (hasInfor != 1) {
    //     wx.getUserProfile({
    //       desc: '请求获取您的头像和昵称', // 声明获取用户个人信息后的用途，后续会展示在弹窗中，请谨慎填写
    //       success: (res) => {
    //         this.userInfor = res.userInfo
    //         uni.setStorage({
    //           key: 'userInfor',
    //           data: res.userInfo,
    //         })
    //         uni.setStorage({
    //           key: 'hasInfor',
    //           data: 1,
    //         })
    //         console.log(this.userInfor.avatarUrl)
    //         this.wyhhyjrequest
    //           .run('setNickname', {
    //             _id: this.user.u_id,
    //             nickName: this.userInfor.nickName,
    //             avatar: this.userInfor.avatarUrl,
    //           })
    //           .then((res) => {
    //             console.log(res)
    //           })
    //       },
    //     })
    //   }
    // },
    tempSave() {
      const storgeData = {
        context: this.context,
        class_id: this.class_id,
        fileList: this.fileList,
        value: this.value,
      }
      console.log(storgeData)
      uni.setStorage({
        key: 'storage',
        data: storgeData,
        success: function () {
          toast.success('已存至草稿箱')
        },
      })
    },
  },
}
</script>

<style>
.footer {
  position: fixed;
  bottom: 2.5%;
  width: 100%;
}

.page {
  margin-top: 2.5%;
  height: 100%;
}

page {
  background-color: #ffffff;
}
</style>